<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/page/public/taglib.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>客户详情</title>
<% request.setAttribute("menu", 1); %>
<%@ include file="/WEB-INF/page/public/contentmeta.jsp"%>
<link rel="stylesheet" href="<%=basePath%>css/global.css" media="all" />
<link rel="stylesheet" href="<%=basePath%>plugins/font-awesome/css/font-awesome.min.css" media="all">
<link rel="stylesheet" href="<%=basePath%>css/system.css" media="all">
<link rel="stylesheet" href="<%=basePath%>css/tab.css" media="all" />

<script type="text/javascript" src="<%=basePath%>js/qualify/zizhisel.js"></script>
<script type="text/javascript" src="<%=basePath%>js/jobsel/job.js"></script>

<style type="text/css">

/* 增行弹窗 */
.addline_1,.addline_2,.addline_3 { display:none; }
.tc_customercontactsdiv,.tc_customercategorydiv,.tc_customerfilediv { margin: 40px 0 0 40px; }
.customtext {height: 30px; width: 265px; font-size: 16px; border: 1px solid #e6e6e6;}
.tc_customercategorydiv .customselect,
.tc_customercontactsdiv .customselect { height: 30px; width: 80px; font-size: 16px;}
 
.tc_btndiv { margin-top: 30px; text-align: center; }
.tc_btndiv .tc_savebtn { width: 100px; height: 40px; text-align: center; border: 0;
			background-color: #a48ad4; cursor: pointer; border-radius: 2px; font-size: 18px; color: rgb(255, 255, 255);}
.tc_customercategorydiv .categoryselect .layui-input-inline,
.tc_customercontactsdiv .categoryselect .layui-input-inline{ width: 268px; }

/* 隐藏显示 */
.hideadd { display: none; }
.showadd { display: block; }

</style>

</head>
<body>


<div class="admin-tab admin-information ">
    <div class="layui-tab layui-tab-card">
        <ul class="layui-tab-title">
        	<a href="/customer/customerinfo1/c${customer.id}"><li class="layui-this"><i class="layui-icon">&#xe612;</i>客户详情</li></a>
            <a href="/customer/customerinfo2/c${customer.id}"><li><i class="layui-icon">&#xe63a;</i>联系记录</li></a>
            <a href="/customer/customerinfo3/c${customer.id}"><li><i class="layui-icon">&#xe631;</i>操作记录</li></a>
        </ul>
        <div class="layui-tab-content">
            <div class="layui-tab-item layui-show">
                <div class="layui-field-box">
                    <fieldset class="layui-elem-field layui-field-title">
                        <legend>客户基本信息</legend>
                    </fieldset>
                    <ul class="clefix TM-infor-ul">
                        <li><label>姓名 : </label><span> ${customer.cname}</span></li>
                        <li><label>证书类型 : </label><span> <dic:cf value="${fn:length(customer.categoryItem) > 0 ? customer.categoryItem.get(0).category : ''}" name="build_category" type="1"/></span></li>
                        <li><label>职称 : </label><span> ${fn:length(customer.categoryItem) > 0 ? customer.categoryItem.get(0).technicalpost : ""}</span></li>
                        <li><label>所属地区 : </label><span><dic:city value="${customer.province}_${customer.city}" /></span></li>
                        <li><label>到期时间 : </label><span> ${fn:length(customer.categoryItem) > 0 ? customer.categoryItem.get(0).endtime.substring(0,10) : ""}</span></li>
                        <li><label>联系电话 : </label><span> ${fn:length(customer.contactsItem) > 0 ? customer.contactsItem.get(0).tel : ""}</span></li>
                        <li><label>手机 : </label><span> ${fn:length(customer.contactsItem) > 0 ? customer.contactsItem.get(0).phone : ""}</span></li>
                        <li><label>qq : </label><span>${fn:length(customer.contactsItem) > 0 ? customer.contactsItem.get(0).qq : ""}</span></li>
                        <li><label>微信 : </label><span>${fn:length(customer.contactsItem) > 0 ? customer.contactsItem.get(0).webchart : ""}</span></li>
                        <li><label>备注 : </label><span>${customer.summary}</span></li>
                    </ul>
                   	<fieldset class="layui-elem-field layui-field-title">
                        <legend>客户状态编辑</legend>
                    </fieldset>
					<div class="tab-condition" style="padding-top:0; margin-bottom:-70px; ">
					    <form class="layui-form clefix customersearcheform" action="" method="post" id="">
							<div class="layui-form-item">
								<div class="layui-input-block">
									<label style="line-height:35px;">客户状态 : </label> 
								</div>
							</div>
							<div class="layui-form-item">
								<div class="layui-input-inline" <c:if test="${customer.state != 4 && userid != customer.uid}">style="margin-top: 5px;"</c:if>>
									<c:if test="${customer.state == 4 }">
	            						<select name="state" id="state" lay-filter="state" value="${customer.state}">
							            	<option value="4" <c:if test="${customer.state == 4}">selected="selected"</c:if>>公共库</option>
							            	<option value="1" <c:if test="${customer.state == 1}">selected="selected"</c:if>>线索库</option>
							            	<option value="2" <c:if test="${customer.state == 2}">selected="selected"</c:if>>跟踪库</option>
							            	<option value="3" <c:if test="${customer.state == 3}">selected="selected"</c:if>>意向库</option>
							            	<option value="5" <c:if test="${customer.state == 5}">selected="selected"</c:if>>合作库</option>
							            </select>
            						</c:if>
            						<c:if test="${customer.state != 4 && userid == customer.uid}">
	            						<select name="state" id="state" lay-filter="state" value="${customer.state}">
							            	<option value="4" <c:if test="${customer.state == 4}">selected="selected"</c:if>>公共库</option>
							            	<option value="1" <c:if test="${customer.state == 1}">selected="selected"</c:if>>线索库</option>
							            	<option value="2" <c:if test="${customer.state == 2}">selected="selected"</c:if>>跟踪库</option>
							            	<option value="3" <c:if test="${customer.state == 3}">selected="selected"</c:if>>意向库</option>
							            	<option value="5" <c:if test="${customer.state == 5}">selected="selected"</c:if>>合作库</option>
							            </select>
            						</c:if>
            						<c:if test="${customer.state != 4 && userid != customer.uid}">
            							<span><dic:cf value="${customer.state}" name="customer_state" type="1"/></span>
            						</c:if>
								</div>
							</div>
							<div class="layui-form-item">
								<!-- <input name="skipToPage" id="skipToPage" type="hidden" value="1">
								<input type="hidden" id="pageNo" name="pageNo" value="1">
								<input type="hidden" id="totalPage" name="totalPage" value="15">-->
								<input type="hidden" value="${customer.type}" id="customertype" name="type">
								<input type="hidden" value="${customer.id}" id="id" name="id" >
								<c:if test="${customer.state == 4 }">
            						<button class="layui-btn customersearchbtn contactIn" type="button" lay-submit="" lay-filter="searchform">+ 添加联系记录</button>
            					</c:if>
            					<c:if test="${customer.state != 4 && userid == customer.uid}">
            						<button class="layui-btn customersearchbtn contactIn" type="button" lay-submit="" lay-filter="searchform">+ 添加联系记录</button>
            					</c:if>
								<c:if test="${customer.state!=4 && userid == customer.uid}">
									<button class="layui-btn layui-btn-primary yybtn"  type="button" style="background:none; color:#51ace1; border-color:#51ace1;"><i class="TM-icon icon-bell"></i>预约</button>
								</c:if>
							</div>
						</form>
					</div>
                </div>
            </div>
        </div>
    </div>
        <div class="entering">
            <h4>
            	<c:if test="${customer.state == 4 }">
            		&nbsp;<button class="layui-btn layui-btn-primary layui-btn-small addline" data="3">+ 添加相关附件</button>
            	</c:if>
            	<c:if test="${customer.state != 4 && userid == customer.uid}">
            		&nbsp;<button class="layui-btn layui-btn-primary layui-btn-small addline" data="3">+ 添加相关附件</button>
            	</c:if>
            </h4>
            <form action="" method="post" enctype="multipart/form-data" id="customerfileform">
            <table class="site-table table-hover">
                <thead>
                <tr>
                    <th style="width:50px;">序号</th>
                    <th style="width:160px;">文件名</th>
                    <th style="width:160px;">操作</th>
                </tr>
                </thead>
                <tbody class="tb_customerfile">
                <c:forEach var="fileobj" items="${customer.filesItem}" varStatus="file">
                	<tr class="filetr${fileobj.id}" data="${fileobj.id}">
	                    <td>${file.index+1}</td>
	                    <td>${fileobj.filesinfo.name}</td>
	                    <td>
	                    	<c:if test="${customer.state == 4 }">
            					<a href="/file/${fileobj.filesinfo.id}">下载</a>
            				</c:if>
            				<c:if test="${customer.state != 4 && userid == customer.uid}">
            					<a href="/file/${fileobj.filesinfo.id}">下载</a>
            				</c:if>
	                    </td>
                	</tr>
                </c:forEach>
                </tbody>
            </table>
            </form>
        </div>
    </div>
    
    <!-- 文件弹窗 -->
    <div class="addline_3" style="width:500px; height:277px;">
    	<div class="tc_customerfilediv">
    		<form class="layui-form" action="" method="post" id="tc_customerfileform" enctype="multipart/form-data">
    			<div class="layui-form-item">
    				<label class="layui-form-label">选择文件 : </label>
    				<input type="file" id="upfile" name="file" class="customtext"/>
    			</div>
    			<div class="layui-form-item">
    				<label class="layui-form-label">备注 : </label>
	                <input type="text" name="remark" id="fsremarks" class="customtext">
    			</div>
    			<div class="layui-form-item tc_btndiv">
    				<input type="hidden" value="0" id="customerfileid" name="fileid">
	            	<input type="submit" value="保存" class="tc_savebtn savecunstomerfilesbtn">
	            </div>
    		</form>
    	</div>
    </div>
    
    <!--添加预约弹窗 -->
	<div id="TM-layui-bookingTo">
		<form action="" method="post" id="bookingform">
			<div class="TM-booking-to" style="padding:10px 20px;">
				<h4 style="margin-bottom:10px;">预约时间</h4>
				<input type="text" name="stime" id="stime" placeholder="YYYY-MM-DD hh:mm:ss" autocomplete="off" class="layui-input" onclick="layui.laydate({elem: this, min: laydate.now(0), istime: true, format: 'YYYY-MM-DD hh:mm:ss'})">
				<h4 style="margin-bottom:10px;">备注</h4>
				<textarea name="remark" id="email-inner" cols="60" rows="5"></textarea>
				<div id="bookingbtndiv">
					<input type="button" value="保存" id="savebooking">
					<input type="button" value="取消" id="cancelbooking">
				</div>
			</div>
		</form>
	</div>
	
	<!--联系记录 -->
	<div id="TM-layui-askFor" style="display:none;">
	  <form class="layui-form" id="tjlxjlForm" action="">
	      <div class="layui-form-item address" style="margin-top:10px">
	            <label class="layui-form-label">联系人： </label>
	            <div class="layui-input-block" style="width:60%">
	                  <select name="contact" id="contact"  lay-filter="contact">
	                    	<option value="">请选择</option>
	                 </select>
	            </div>
	        </div>
		     <div class="layui-form-item layui-form-text">
			    <label class="layui-form-label">备注：</label>
			    <div class="layui-input-block" style="width:60%">
			      <textarea id="remark" name="remark" placeholder="请输入内容" class="layui-textarea"></textarea>
			        <input name="id" id="jlid" type="hidden" value="0">
			    </div>
			  </div>
	    </form>
	</div>
    
</div>
<script>
    layui.use(['laypage','form','element','laydate'], function() {
        var $ = layui.jquery,
                laypage = layui.laypage,
                element = layui.element();
        var form = layui.form();
        
        var jobselobj=   $("#zizhiType").jobsel({
           	'inputName' : "category"
           });
      
      jobselobj.init();
      
      
    	//更新渲染  
	   form.render('select'); 
        
      	//增行
        $(".addline").on("click",function(){
        	var addtype = $(this).attr("data");
        	var content = $(".addline_"+addtype);
        	var title;
        	var width;
        	var length;
        	if (addtype == 1) {
        		title = "添加联系人";
        		width = "500px";
        		heigth = "400px";
        	} else if (addtype == 2) {
        		title = "添加需求信息";
        		width = "500px";
        		heigth = "400px";
        	} else {
        		title = "添加文件";
        		width = "500px";
        		heigth = "400px";
        	}
        	layer.open({
        		  type:1,
		  		  title:title,
		  		 zIndex: 999,
		  		  shadeClose:true,
		  		  content: content,
		  		  area:[width,heigth],
        	});
        });
        
      	
      
      //点击保存文件
        $(".savecunstomerfilesbtn").on("click",function(){
        	var file = $("#upfile").val();
        	if (file == null || file == ""){
        		layer.msg("请选择您要上传的文件");
        		return false;
        	} else {
        		var infoid = $("#id").val();
        		var url = "/customer/uploadCustomerfilei"+infoid+"_t"+1;
        		$("#tc_customerfileform").attr("action",url);
        		layer.msg("文件上传中",function(){
        			$("#tc_customerfileform").submit();
        		})
        	}
        });
      
      
      //打开预约弹窗
	   	$(".yybtn").on("click",function(){
	   		
			//然后就是打开弹窗
			layer.open({
     		  	type:1,
	  			title:"添加预约",
	  			zIndex: 999,
	  			//shadeClose:true,
	  			content: $("#TM-layui-bookingTo"),
	  			area:[500,600],
     		});
	   	});
      
	  //保存预约
    	$("#savebooking").on("click",function(){
    		
			var stime = $("#stime").val();
			var remark = $("#email-inner").val();
    		
			if (stime == null || stime == "") {
				layer.tips("请选择预约时间", $("#stime"), {
					tips: [2,tipColor],
	     		 tipsMore: true
	     		});
				return false;
			}
			
			var id = $("#id").val();
			
			 $.ajax({
				type : "post",
				url : "/customer/addcontactsdynamicinfo",
				data : {stime:stime,remark:remark,cusid:id},
				dataType : "json",
				success : function(data){
					if (data == 0) {
						layer.msg("预约失败，请重试",function(){
							layer.closeAll();
						});
					} else {
						layer.msg("预约成功",function(){
							layer.closeAll();
						});
					}
				}
			});
    		
    	});
	  
    	//联系记录弹窗
        $('.contactIn').on('click',function(){
           var cid = $("#id").val();
           $.ajax({
		 		type : "post",
		 		url : "/customer/customerinfoajax",
		 		data : {id:cid},
		 		dataType : "json",
		 		async : false,
		 		success : function(data){
		 			var html ="";
		 		    var contacts =	data.contactsItem;
		 		    var cname = data.cname; 
		 		    if(contacts!=null&&contacts.length>0){
		 		    	for(var i =0;i<contacts.length;i++){
		 		    		 html+="<option value='"+contacts[i].id+"'>"+contacts[i].name+"(电话："+contacts[i].phone+")</option>";
		 		    	} 
		 		    	$("#contact").html(html);
		 		    }else{
		 		    	$("#contact").html("<option value=''>请选择联系人</option>");
		 		    }
		 			form.render(); 
		 			 layer.open({
	                        type:1,
	                        content:$('#TM-layui-askFor'),
	                        btn:['确定','取消'],
	                        btnAlign:'c',
	                        shadeClose:true,
	                        title:cname+'添加联系记录',
	                        area:['600px','300px'],
	                        maxWidth:800,
	                        yes: function(layero, index){
	                        	$("#tjlxjlForm").submit();
	                        }
	                 });
		 		}
		 	});
        });
    	
        $("#tjlxjlForm").validate({
        	rules: {
        		contact : {
	    			required:true,
	    		},
	    		remark: {
	    			required:true, 
	    		}
	    	},
	    	messages: {
	    		contact : {
	    			required:"请选择联系人",
	    		},
	    		remark: {
	    			required:"请填写备注",
	    		} 
	    	},
	    	errorPlacement: function(error, element) {
				layer.tips(error.text(), element, {
					tips: [2,tipColor],
	     		 tipsMore: true
	     		});
	   		}, 
	   	 submitHandler: function(form) {
	   		    var cuid = $("#contact").val(),
	   		  	remark=$("#remark").val(),
	   		    cdid=$("#jlid").val();
	   		    var cusid = $("#id").val();
             	$.ajax({
   		 		type : "post",
   		 		url : "/customer/addcontactsdynamicinfo",
   		 		data : {id:cdid,ccuid:cuid,remark:remark,cusid:cusid},
   		 		dataType : "json",
   		 		async : false,
   		 		success : function(data){
   		 		    if(data==1){
   		 		       layer.closeAll();
   		 		       layer.msg("添加联系记录成功", {  icon: 1  },function(){
   		 		    	   window.location.href = "redirect:/customer/customerinfo1/c"+id; 
   		 		    	});  
   		 		    }else{
   		 		       layer.msg("添加联系记录失败", {  icon: 2  });  
   		 		    }
   		 		}
   		 	});  
	   	 
	      }
        });
        
        /*监听select改变*/
        form.on('select(state)', function(data){
        	var state = data.value;
        	var id = $("#id").val();
        	var type = $("#customertype").val();
        	var text;
        	if (state == 1) {
        		text = "线索库";
        	} else if (state == 2) {
        		text = "跟踪库";
        	} else if (state == 3) {
        		text = "意向库";
        	} else if (state == 5) {
        		text = "合作库";
        	} else {
        		text = "公共库";
        	}
        	
        	$.ajax({
        		type : "post",
        		url : "/customer/savecustomer",
        		data : {id:id,state:state,type:type},
        		dataType : "json",
        		success : function(data){
        			if (data > 0) {
        				layer.msg("客户移入"+text+"成功");
        				$(".cusstate").text(text);
        			} else {
        				layer.msg("操作失败请重试");
        			}
        		} 
        		
        	})
        });
        
      //点击修改categorys
        $(document).on("click",".updatecustomercategory",function(){
        	var ids = $(this).parent().parent().attr("data");
        	$.ajax({
        		type: "post",
        		url: "/customer/getcustomercategory",
        		data: {ids:ids},
        		dataType: "json",
        		success:function(data){
        			$("#category").val(data["category"]);
                	$("#types").val(data["type"]);
                	$("#paperspurpose").val(data["paperspurpose"]);
                	$("#remarks").val(data["remark"]);
                	$("#categoryid").val(ids);
                	jobselobj.selData();
                	form.render();
                	layer.open({
              		  	type:1,
        		  		title:"修改需求信息",
        		  		zIndex: 999,
        		  		shadeClose:true,
        		  		content: $(".addline_2"),
        		  		area:[400,500],
              		});
        		}
        	})
        });
      	
      	//点击修改联系人
      	$(document).on("click",".updatecustomercontacts",function(){
      		var ids = $(this).parent().parent().attr("data");
      		$.ajax({
      			type: "post",
      			url: "/customer/getCustomerContact",
      			data: {ids:ids},
      			dataType: "json",
      			success:function(data){
					$("#name").val(data["name"]);
					$("#phone").val(data["phone"]);
					$("#qq").val(data["qq"]);
					$("#contactsid").val(ids);
					$("#webchart").val(data["webchart"]);
					layer.open({
              		  	type:1,
        		  		title:"修改联系人信息",
        		  		zIndex: 999,
        		  		shadeClose:true,
        		  		content: $(".addline_1"),
        		  		area:[500,600],
              		});
      			}
      		});
      	});
        
        
	  
	  
	  
      
    });
</script>
</body>
</html>